﻿@using JaxDug.Models
@using JaxDug.Models.Features
@model IEnumerable<JaxDug.Models.FeaturedObjects.Book>
<section id="book-list-section">
    @foreach (var book in Model)
    {
        <article class="book-list-item">
            <table width="100%" height="100%">
                <tr>
                    <td width="200px">
                        @Html.ImageLink(book.CoverImageUrl, "", book.AmazonUrl, new { target = "_blank", @class = "amazon" }, new { @class = "coverimage" })
                    </td>
                    <td width="50px" class="vote-controls">
                        <ul>
                            <li class="vote-up">
                                <img src="@Url.Content("../../images/arrow_top.png")" border="0" alt="Vote Up" onclick="Vote(@book.Id,1);"/>
                            </li>
                            <li class="vote-rank">@book.Score</li>
                            <li class="vote-down">
                                <img src="@Url.Content("../../images/arrow_down.png")" border="0" alt="Vote Down" onclick="Vote(@book.Id,2);"/></li>
                        </ul>
                    </td>
                    <td>
                        <h3 class="title">@book.Title</h3>
                        <h4 class="authors">
                            Author: @book.Author</h4>
                        <p class="description">@book.Description</p>
                        @Html.Partial("ListComments", book.GetFeatureList<Comment>().Results) </td>
                </tr>
            </table>
        </article>
    }
</section>
<script type="text/javascript">
    function Vote(id, choice) {
        $.get("Book/CastVote?id=" + id + "&choice=" + choice, function (data) {
            $('#book-list-section').replaceWith(data);
        });
    }
</script>